/******************************************************************************
* File description: modelconfighunhe.qml
* Function: 模型配置：混合判定
* Current Version: 1.0.0
* Author: 张宇轩
* Date: 2024-08-19
*  -----
*  Copyright by 博坤生物 .
 *****************************************************************************/
import QtQuick 2.14
import QtQuick.Controls 2.14
import QtQuick.Layouts 1.14
import Qt.labs.qmlmodels 1.0

Item {
    id: root

    /* property 定义开始 */
    // 表格数据
    property var tableModels: []

    // 私有
    property var _tableModel: root.tableModels
    // 横向表头
    property var _horHeaderData: ["参数", "值"] // 标题
    property int _horHeaderHeight: 36 // 高度
    // table
    property int _tableItemHeight: 40 // tableitem高度

    // 信号
    signal submit(string tableData); // 确认
    signal cancel(); // 取消

    // C++槽函数

    // 函数
    // 数据修改函数

    /* property 定义结束 */

    Rectangle {
        id: container

        anchors.fill: parent
        color: "#FFFFFFFF"
        radius: 12
        border.width: 0

        ColumnLayout {
            id: containerColLayout
            anchors {
                fill: parent
                leftMargin: 20
                rightMargin: 20
                topMargin: 40
                bottomMargin: 40
            }
            spacing: 40

            // 表格
            Item {
                id: tableViewContainer
                Layout.fillWidth: true
                Layout.fillHeight: true

                // 横向表头
                Item {
                    id: horizontalHeader
                    height: _horHeaderHeight
                    anchors.top: parent.top
                    anchors.left: parent.left
                    anchors.right: parent.right

                    Row {
                        spacing: 0

                        Repeater {
                            model: _horHeaderData

                            Item {
                                width: (index % 2) === 0 ?
                                           horizontalHeader.width * 0.46 : horizontalHeader.width * 0.54
                                height: horizontalHeader.height

                                Rectangle {
                                    anchors.fill: parent
                                    border.width: 0
                                    color: "#FFEBF3FF"

                                    Text {
                                        text: qsTr(modelData)
                                        anchors.centerIn: parent
                                        font.pixelSize: 16
                                        font.family: "Alibaba PuHuiTi"
                                        color: "#222"
                                    }
                                }

                                // 画边框
                                Canvas {
                                    id: horHeaderCanvas
                                    antialiasing: true
                                    anchors.fill: parent
                                    onPaint: {
                                        var ctx = getContext("2d")
                                        ctx.clearRect(0, 0, width, height)
                                        ctx.strokeStyle = "#FFCCCCCC"
                                        ctx.lineWidth = 2
                                        ctx.beginPath()

                                        // 左边框
                                        ctx.moveTo(0, 0)
                                        ctx.lineTo(0, height)
                                        ctx.stroke()

                                        // 上边框
                                        ctx.moveTo(0, 0)
                                        ctx.lineTo(width, 0)
                                        ctx.stroke()

                                        // 下边框
                                        ctx.moveTo(0, height)
                                        ctx.lineTo(width, height)
                                        ctx.stroke()
                                    }
                                }

                                // 右边框
                                Canvas {
                                    id: horHeaderCanvasRightBorder
                                    visible: index === 1
                                    antialiasing: true
                                    anchors.fill: parent
                                    onPaint: {
                                        var ctx = getContext("2d")
                                        ctx.clearRect(0, 0, width, height)
                                        ctx.strokeStyle = "#FFCCCCCC"
                                        ctx.lineWidth = 2
                                        ctx.beginPath()
                                        ctx.moveTo(width, 0)
                                        ctx.lineTo(width, height)
                                        ctx.closePath()
                                        ctx.stroke()
                                    }
                                }

                                onWidthChanged: {
                                    horHeaderCanvasRightBorder.requestPaint()
                                }
                            }
                        }
                    }
                }

                // tableview
                TableView {
                    id: tableContent
                    anchors {
                        fill: parent
                        topMargin: _horHeaderHeight
                    }
                    clip: true
                    boundsBehavior: Flickable.StopAtBounds
                    columnSpacing: 0
                    rowSpacing: 0

                    Component.onCompleted: {
                        root.tableModels = [
                                    {"参数": "R1", "值": 0.5},
                                    {"参数": "R2", "值": 1},
                                    {"参数": "R3", "值": 2},
                                    {"参数": "X1", "值": 3}
                                ]
                    }

                    columnWidthProvider: function(column){
                        let res;
                        res = column === 0 ?
                                    0
                                  :
                                    column % 2 === 1 ?
                                        tableViewContainer.width * 0.46
                                      :
                                        tableViewContainer.width * 0.54
                        return res
                    }

                    rowHeightProvider: function(row){
                        return _tableItemHeight
                    }

                    model: TableModel {
                        id: tableModel

                        TableModelColumn {display: "id"}
                        TableModelColumn {display: "参数"}
                        TableModelColumn {display: "值"}
                        rows: root._tableModel
                    }

                    delegate: DelegateChooser {
                        id: itemDele

                        // id
                        DelegateChoice {
                            id: idItem

                            column: 0
                            delegate: Label {
                                id: idLabel
                                width: tableContent.columnWidthProvider(column)
                                height: tableContent.rowHeightProvider(0)
                                font.family: "Alibaba PuHuiTi"
                                font.pixelSize: 16
                                color: "#FF222222"
                                verticalAlignment: Text.AlignVCenter
                                horizontalAlignment: Text.AlignHCenter
                                text: qsTr(display)
                                antialiasing: true
                            }
                        }

                        // 参数
                        DelegateChoice {
                            id: paramItem

                            column: 1
                            delegate: Label {
                                id: paramLabel
                                width: tableContent.columnWidthProvider(column)
                                height: tableContent.rowHeightProvider(0)
                                font.family: "Alibaba PuHuiTi"
                                font.pixelSize: 16
                                color: "#FF222222"
                                verticalAlignment: Text.AlignVCenter
                                horizontalAlignment: Text.AlignHCenter
                                text: qsTr(display)
                                antialiasing: true

                                // 边框
                                Canvas {
                                    anchors.fill: parent
                                    antialiasing: true
                                    onPaint: {
                                        var ctx = getContext("2d")
                                        ctx.strokeStyle = "#FFCCCCCC"
                                        ctx.lineWidth = 2
                                        // 左边框
                                        ctx.moveTo(0, 0)
                                        ctx.lineTo(0, height)
                                        ctx.stroke()
                                        // 下边框
                                        ctx.moveTo(0, height)
                                        ctx.lineTo(width, height)
                                        ctx.stroke()
                                    }
                                }
                            }
                        }

                        // 值
                        DelegateChoice {
                            id: valueItem
                            column: 2
                            delegate: BaseTextInput {
                                id: valueInput
                                width: tableContent.columnWidthProvider(column)
                                height: tableContent.rowHeightProvider(0)
                                inputFontPixelSize: 16
                                inputHAlign: Text.AlignHCenter
                                inputText: display
                                placeholderText: ""
                                inputBorderWidth: 0
                                inputRadius: 0

                                // 边框
                                Canvas {
                                    id: valueItemCanvas
                                    anchors.fill: parent
                                    antialiasing: true
                                    onPaint: {
                                        var ctx = getContext("2d")
                                        ctx.strokeStyle = "#FFCCCCCC"
                                        ctx.lineWidth = 2
                                        // 左边框
                                        ctx.moveTo(0, 0)
                                        ctx.lineTo(0, height)
                                        ctx.stroke()
                                        // 下边框
                                        ctx.moveTo(0, height)
                                        ctx.lineTo(width, height)
                                        ctx.stroke()
                                        // 右边框
                                        ctx.beginPath()
                                        ctx.moveTo(width, 0)
                                        ctx.lineTo(width, height)
                                        ctx.closePath()
                                        ctx.stroke()
                                    }
                                }

                                // 编辑
                                onTextEdited: function(text){
                                    root.tableDataChanged(root._tableModel[row]["参数"], text)
                                }

                                // 宽度变化
                                onWidthChanged: {
                                    valueItemCanvas.requestPaint();
                                }
                            }
                        }
                    }

                    // 事件
                    onWidthChanged: {
                        forceLayout() // 强制重新布局刷新视图
                    }

                    onHeightChanged: {
                        forceLayout() // 强制重新布局刷新视图
                    }
                }
            }

            // 按钮
            Item {
                id: btnContainer

                Layout.fillWidth: true
                Layout.preferredHeight: 40

                RowLayout {
                    anchors.fill: parent
                    spacing: 8

                    CustomHorSpacerItem {}

                    // 取消
                    PureButton {
                        id: cancelBtn
                        pureText: "取消"
                        onReleased: {
                            root.cancel()
                        }
                    }

                    // 确定
                    GradientButton {
                        id: submitBtn
                        gradText: "确定"
                    }


                    CustomHorSpacerItem {}
                }
            }
        }
    }
}
